@charset "UTF-8";
@import "step";
body, h1, h2, h3, h4, h5, h6, p, ul, ol, li, input, select, textarea, div, table, td, th, tr, dt, dd, dl { margin: 0; padding: 0; }
ul, ol { list-style: none; }
em, i { font-style: normal; }
table { border-spacing: 0; border-collapse: collapse; margin: inherit; }
img { border: none; vertical-align: middle; }
input, select, button { vertical-align: middle; outline: none; }
a { text-decoration: none; color: $color; }
a:hover { color: $theme; }
body {background: #fff; min-width: 1200px;  font-family: "Microsoft Yahei",Arial,Tahoma,Helvetica,"SimSun","Hiragino Sans GB",sans-serif; outline: 0;   color: $color; font-size: $fontsize; overflow-x: hidden; }
.fl { float: left; } 
.fr { float: right; }
.hide { display: none; }
.clear:before, .clear:after { content: ''; display: block; clear: both; }
.gray { -webkit-filter: grayscale(100%); -moz-filter: grayscale(1); -ms-filter: grayscale(100%); -o-filter: grayscale(100%); filter: grayscale(100%); -webkit-filter: gray; filter: gray; }
.center {width: 1200px; margin: 0 auto; position: relative; }
/*字体按钮*/
.fonticon{
    width: 1.5em;
    height: 1.5em;
    vertical-align: -0.15em;
    fill: currentColor;
    overflow: hidden;
  }

.img{
    display: block;
    overflow: hidden;
    img{
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
        transition: all 0.2s linear;
    }
    
}
.bgfff{
    background: #fff;
}
a:hover{
    .ico_jt{
        &::before,&::after{
            background: var(--color);
        }
    }
}
:root{
    --color:#358FF0;
    --hovercolor:#2476EA; 
    --hoverbgopacity:#EFF6FE; 
}
.flex1{
    flex: 1;
    
}
/*t头部*/
.header-wrap{
    .header-top{
        height: 36px;
        line-height: 36px;
        font-size: 12px;
        .center{
            display: flex;
            align-items: center;
            overflow: hidden;
            a{
                color: $color;
            }
            a[href]:hover{
                color: $theme;
            }
            .flex1{
                text-align: right;
                height: 30px;
                a{
                    color: #666666;
                    &::before{
                        content: '|';
                        margin: 0 10px;
                        opacity: 0.4;
                        font-size: 10px;
                        margin-top: -4px;
                        display: inline-block;
                        vertical-align:middle;
                        height: 12px;
                        line-height: 12px;
                    }
                    &:first-of-type{
                        &::before{
                            display: none;
                        }
                    }
                }
                .btn{
                    height: 18px;
                    line-height: 18px;
                    border: 1px solid #FF5050;
                    border-radius: 4px;
                    display: inline-block;
                    vertical-align: middle;
                    padding: 0 6px;
                    background: #fff;
                    color: #FF5050;
                    &:hover{
                        color: #fff;
                        background: #FF5050;
                    }
                    &::before{
                        display: none;

                    }
                }
            }
        }
    

    }
    .header-center{
        background: #fff;
        & > .center{
            display: flex;
            height: 102px;
            align-items: center;
            justify-content: space-between;
        }
        .logo{
            line-height: 40px;
            font-size: 30px;
            font-weight: bold;
            width: auto;
            height: 80px;
            img{
                width: auto;
                height: 80px;
            }
        }
        .search{
            width: 468px;
            height: 46px;
            border-radius: 8px 8px 8px 8px;
            opacity: 1;
            border: 1px solid #358FF0;
            display: flex;
            overflow: hidden;
            .input{
                flex: 1;
                overflow: hidden;
                border:none;
                background: none;
                padding: 0 10px;
                font-size: 16px;
                color: #aaa;
            }
            .button{
                width: 88px;
                border:none;
                background: none;
                background: #358FF0;
                color: #fff;
                font-size: 16px;
                cursor: pointer;
                outline: none;
                &:hover{
                    opacity: 0.9;
                }
            }

        }
    }
    .header-nav{
        height: 70px;
        line-height: 70px;
        background: var(--color);
        li{
            width: 160px;
            float: left;
            color: #fff;
            height: 70px;
            text-align: center;
            font-size: 18px;
            position: relative;

            a{
                display: block;
                width: 100%;
                height: 100%;
                cursor: pointer;
                color: #fff;

            }
            &.on,&:hover{
                background: var(--hovercolor);
                font-weight: bold;
                font-size: 20px;
            }
            &.hot{
                &::after{
                    content: '';
                    display: block;
                    background: url("../images/hot.png");
                    width: 42px;
                    height: 28px;
                    position: absolute;
                    right: 0px;
                    top: -8px;
                }
            }


        }

    }
    &.theme{
        .header-top{
            background: #F5F5F7;
            a{
                color: #666;
            }
        }
        .header-center{
            & > .center{
                height: 90px;
                justify-content: center;
                .logo{
                    height: 90px;
                    img{
                        height: 90px;
                    }
                }
            }
        }
    }
}
/*底部*/
.footer-wrap{
    background: #444;
    color: #BBBBBB;
    padding: 20px 0;
    font-size: 15px;
    p{
        text-align: center;
        line-height: 30px;
        span{
            padding: 0 0px 0 30px;
        }
    }
    a{
        color: #BBBBBB;
        &:hover{
            opacity: 1;
            color: $theme;
        }
    }

}
.common{
    min-height:calc(100vh - 388px);
    padding-top: 20px;
}
.title{
    height: 60px;
    line-height: 60px;
    overflow: hidden;
    position: relative;
    .bt{
        float: left;
        font-size: 22px;
        font-weight: bold;
        &::before{
            position: absolute;
            left: 0px;
            top: 50%;
            margin-top: -15px;
            width: 24px;
            height: 24px;
            background: var(--color);
            border-radius:50%;
            opacity: 0.3;
            content: '';
        }
        span{
            position: relative;
            z-index: 1;
            padding-left: 8px;
        }
    }
    .more{
        float: right;
        color: #666;
        cursor: pointer;
        &:hover{
            color: var(--color);
        }

    }
    &.bor{
        border-bottom: 1px solid #f1f1f1;
        .bt::before{
            display: none;
        }
    }
}
.title2{
    font-size: 18px;
    border-bottom: 1px solid #F1F1F1;
    height: 52px;
    line-height: 52px;
    .tab{
        margin-right: 32px;
        position: relative;
        height: 52px;
        display: block;
        float: left;
        cursor: pointer;
        &.on,&:hover{
            color: var(--color);
            font-weight: bold;
           &::after{
            width: 100%;
            height: 2px;
            background: var(--color);
            left: 0px;
            bottom: 0px;
            position: absolute;
            content: '';

           }
        }
    }

}
.title_bt{
    height: 38px;
    line-height: 38px;
    background: #F5F5F7;
    border-radius: 4px 4px 4px 4px; 
    display: block;
    padding: 0 16px;
    .bt{
        float: left;
        font-size: 18px; 
    }
    .more{
        float: right;
        color: #666666;
        font-size: 14px;
        &:hover{
            color: var(--color);
        }
        span{
            font-family: serif;
            padding-left: 5px;
        }
    }

    
}
.title_switch{
    height: 54px;
    border-bottom: 1px solid var(--color);
    margin-bottom: 20px;
    .flex{
        display: flex;
        li{
            flex: 1;
            overflow: hidden;

        }

    }
    li{
        float: left;
        height: 52px;
        line-height: 52px;
        border:1px solid transparent;
        font-size: 18px;
        text-align: center;
        border-radius: 8px 8px 0 0;
        cursor: pointer;
        a{
            display: block;
            padding: 0 30px;
            min-width: 100px;
        }
        &.on{
           background: var(--hoverbgopacity); 
           font-weight: bold;
           padding-bottom: 1px;
           border-color: var(--color);
           border-bottom-color:var(--hoverbgopacity);
           a{
            color: var(--color);
           }

        }

    }
}
.title_switch_small{
    height: 44px;
    padding: 20px 0 16px;
    li{
        float: left;
        height: 42px;
        line-height: 42px;
        border:1px solid #EFEFEF;
        font-size: 16px;
        text-align: center;
        border-radius: 8px;
        background: #f9f9f9;
        margin-right: 16px;
        &:last-child{
            margin-right: 0px;
        }
        a{
            display: block;
            padding: 0 4px;
             min-width: 100px;
        }
        &.on,&:hover{
           background: var(--color); 
           border-color: var(--color);
           color: #fff;
           a{
            color: #fff;
           }

        }

    }
}
 
.ContL{
    width: 768px;
    margin-right: 40px;
}
.commentheme1{
    background: #F9F9F9;
    padding-top: 0px;
    .cumber{
        padding-top: 20px;
    }
    .ContL{
       width: 218px;
       margin-right: 30px;
    }
    .ContR{
        width: 952px;
        .bgfff{
            padding: 15px 30px;
        }
    }
}
.ContR{
    width: 392px;
    .Ritem{
        padding-bottom: 20px;
        .title{
            height: 30px;
            line-height: 30px;
        }
    }
}
.cumber{
    color: #999;
    height: 20px;
    line-height: 20px;
    overflow: hidden;
    @include single-line-ellipsis;
    padding-bottom: 5px;
    a{
        color: #999;
        &[href]:hover{
            color: var(--color);
        }
    }
    span{
        font-family: serif;
        padding: 0 5px;
    }
}
.Iindexbox{
    padding-bottom: 20px;
    overflow: hidden;
}
/*首页板块1*/
.Iindex1{
    .Iindex1-1{
        width: 530px;
        .swiper{
            height: 300px;
            border-radius: 16px;
            overflow: hidden;
            width: 100%;
            margin-bottom: 8px;
            .img{
                width: 100%;
                height: 300px;
                display: block;
                color: #fff;
                overflow: hidden;
                position: relative;
                border-radius: 16px;
                &:hover{
                    color: var(--color);
                    img{
                        transform: scale(1.1);
                    }
                }
                p{
                    height: 144px;
                    background: linear-gradient(180deg, rgba(0,0,0,0) 0%, #000000 100%);
                    opacity: 1; 
                    position: absolute;
                    left: 0;
                    bottom: 0;
                    width: 100%;
                    padding: 0 20px;
                    padding-top: 94px;
                  
                    text-align: center;
                    box-sizing: border-box;
                    line-height: 40px;
                    @include single-line-ellipsis;
                }
            }
            .swiper-button-prev,.swiper-button-next{
                background: none;
                background: url("../images/prev.png") no-repeat center;
                width: 32px;
                height: 32px;
                cursor: pointer;
                margin-top: -16px;
                &:hover{
                    opacity: 0.9;
                }
                &::after{
                    display: none;
                }
              
            }
            .swiper-button-next{
                transform: rotate(180deg);
            }
        }
        .list{
            font-size: 14px;
           .li_a{
                .box{
                    width: 166px;
                    display: block;
                    float: left;
                    margin-right: 16px;
                    &:nth-child(3n){
                        margin-right: 0px;
                    }
                    &:hover img{transform: scale(1.1);}
                    .img{
                        width: 100%;
                        height: 92px;
                        border-radius: 10px;
                    }
                    p{
                        height: 20px;
                        line-height: 20px;
                        overflow: hidden;
                        padding-top: 8px;
                        text-align: center;
                        font-size: 14px;
                        @include single-line-ellipsis;
                    }
                }
           } 
           .li_b{
              .p{
                padding-top: 14px;
                display: flex;
                overflow: hidden;
                height: 28px;
                line-height: 28px;
                span{
                    color: var(--color);
                    padding-right: 10px;
                }
                p{
                    flex: 1;
                    overflow: hidden;
                    @include single-line-ellipsis;

                }
                .btn{
                    display: block;
                    width: 64px;
                    background: var(--hoverbgopacity);
                    color: var(--color);
                    text-align: center;
                    border-radius: 6px;
                    font-size: 13px;
                    &:hover{
                        background: var(--color);
                        color: #fff;
                    }

                }

              }
           }
        }
    }
    .Iindex1-2{
        width: 440px; 
        padding: 0 30px;
        .h1_a{
            height: 25px;
            line-height: 25px;
            font-size: 20px;
            display: block;
            color: #FF803D;
            text-align: center;
            font-weight: bold;
            @include single-line-ellipsis;
        }
        .h2_a{
            height: 16px;
            line-height: 16px;
            padding-top: 16px;
            overflow: hidden;
            color: #FF803D; 
            font-size: 14px;
            a{
                color: #FF803D;  
                display: block;
                height: 100%;
                float: left;
                width: 50%;
                text-align: center;
                overflow: hidden;
            }
        }
        .list{
            margin-top: 17px;
            border-top: 1px solid #F1F1F1;
            padding-top: 9px;
            position: relative;
            &::before{
                left: 3px;
                top: 25px;
                border: 1px dashed #CFCFCF;
                height: calc(100% - 45px);
                content: '';
                position: absolute;
                z-index: 1;
            }
            li{
                height: 38px;
                line-height: 38px;
                display: flex;
                position: relative;
                z-index: 1;
                &:hover{
                    &::before{
                        background: var(--color);
                    }
                }
                &::before{
                    content: '';
                    width: 4px;
                    height: 4px;
                    background: #CFCFCF;
                    border-radius: 50%;
                    opacity: 1;
                    display: block;
                    left: 2px;
                    top: 50%;
                    margin-top: -2px;
                    position: absolute;
                }
                p{
                    flex: 1;
                    overflow: hidden;
                    padding-left: 20px;
                    font-size: 14px;
                    @include single-line-ellipsis;
                }
                span{
                    color: #999;
                    font-size: 13px;
                }

            }
        }

    }
    .Iindex1-3{
        width: 170px;
       .list{
          .box{
                margin-bottom: 16px;
                display: block;
                &:last-child{
                    margin-bottom: 0px;
                }
                &:hover img{transform: scale(1.1);}
                .img{
                    width: 100%;
                    height: 93px;
                    border-radius: 10px;
                }
                p{
                    padding-top: 8px;
                    font-size: 14px;  
                    @include multi-line-ellipsis(2,20px);
                }
          }
       } 
    }
}
.Iindex2{
    & > .clear + .clear{
        padding-top: 10px;
        .Iindex2-1{
            padding-top: 15px;
        }
    }
    .Iindex2-1{
        width: 768px;
        .title{
            padding-bottom: 8px;
        }
        .list{
            padding-bottom: 40px;
            &:last-child{
                padding-bottom: 0px;
            }
            .box{
                float: left;
                margin: 16px 24px 0 0;
                display: block;
                overflow: hidden;
                width: 174px;
                height: 62px;
                border-radius:10px ;
                position: relative;
                img{
                    width: 100%;
                    height: 100%;
                    display: block;
                    object-fit: cover;
                }
                .motai{
                    position: absolute;
                    top: 100%;
                    left: 0px;
                    background: rgba(0, 0, 0, 0.5);
                    width: 100%;
                    height: 100%;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    transition: all 0.2s linear;
                    .btn{
                        width: 62px;
                        height: 30px;
                        background: var(--color);
                        border-radius: 30px;
                        opacity: 1;
                        color: #fff;
                        text-align: center;
                        line-height: 30px;
                        font-size: 14px;
                        overflow: hidden;
                    }
                }
                &:hover{
                    .motai{
                        top: 0px;
                    }
                }
                &:nth-child(4n){
                    margin-right: 0px;
                }
                &.box2{
                    display: flex;
                    overflow: hidden;
                    border: 1px solid #EFEFEF;
                    box-sizing: border-box;
                    align-items: center;
                    img{
                        width: 46px;
                        height: 46px;
                        border-radius: 10px;
                        overflow: hidden;
                        margin: 0 16px 0 24px;

                    }
                    p{
                        flex: 1;
                        overflow: hidden;
                        @include single-line-ellipsis;
                        font-size: 16px;
                    }
                }
            }
            ul{
                li{
                    float: left;
                    width: 78px;
                    margin-right: 60px;
                    margin-top: 24px;
                    &:nth-of-type(6n){
                        margin-right: 0px;
                    }
                    .img{
                        width: 78px;
                        height: 78px;
                        border-radius: 10px;
                        display: block;
                    }
                    .name{
                        height: 43px;
                        width: 100%;
                        text-align: center;
                        line-height: 43px;
                        overflow: hidden;
                        display: block;
                        font-size: 16px;
                    }
                    .btn{
                        display: block;
                        height: 32px;
                        background: #F6F6F6;
                        border-radius: 6px; 
                        display: block;
                        overflow: hidden;
                        text-align: center;
                        line-height: 32px;
                        color: #999;
                        &:hover{
                            background: var(--color);
                            color: #fff;
                        }
                    }


                }
            }
        }
    }
    .Iindex2-2{
        width: 392px;
        .list{
            li{
                display: flex;
                overflow: hidden;
                padding-top: 24px;
                .img{
                    width: 142px;
                    height: 90px;
                    display: block;
                    border-radius: 10px;
                    margin-right: 16px;
                    &:hover{
                        img{
                            transform: scale(1.1);
                        }
                    }
                }
                .flex1{
                    overflow: hidden;
                    .name{
                        font-size: 16px;
                        @include multi-line-ellipsis(2,24px);
                    }
                    .bq{
                        height: 24px;
                        line-height: 24px;
                        padding-top: 16px;
                        overflow: hidden;
                        display: flex;
                        .p{
                            flex: 1;
                            overflow: hidden;
                            .lab{
                                background: #FFF2EC;
                                border-radius: 5px 5px 5px 5px;  
                                padding: 0 7px; 
                                float: left;
                                color: #FF803D;
                                font-size: 12px;
                                margin-right: 5px;

                            }
                        }
                        span{
                            font-size: 13px;
                            color: #999;
                        }
                    }
                }
            }
        }
        .list2{
            li{
                padding-top: 24px;
                .box{
                    display: flex;
                    overflow: hidden;
                    .img{
                        width: 78px;
                        height: 78px;
                        border-radius: 18px;
                        margin-right: 16px;

                    }
                    .flex1{
                        overflow: hidden;
                        .name{
                            display: block;
                            overflow: hidden;
                            @include multi-line-ellipsis(2,24px);
                            font-size: 16px;
                            height: 48px;
                            padding-top: 5px;
                        }
                        p{
                            height: 20px;
                            line-height: 20px;
                            overflow: hidden;
                            color: #999;
                            overflow: hidden;
                            padding-top: 5px;
                        }
                    }
                    .hot{
                       color: #999; 
                       padding-top: 5px;
                       height: 24px;
                       line-height: 24px;
                       i{
                        display: inline-block;
                        vertical-align: middle;
                        background: url("../images/redu.png");
                        width: 12px;
                        height: 14px;
                        margin: -2px 6px 0 0;
                        
                       }
                    }
                }
            }
        }
    }
}
.Iindex3{
    .Iindex3-1{
        width: 768px;
        .list{
            padding-top: 8px;
            padding-bottom: 24px;
           li{
            padding: 16px 0;
              .box{
                display: flex;
                overflow: hidden;
                &:hover{
                    img{
                        transform: scale(1.1);       
                    }
                }
                .img{
                    width: 172px;
                    height: 96px;
                    border-radius: 12px;
                    overflow: hidden;

                }
                .flex1{
                    overflow: hidden;
                    padding-left: 20px;
                    .name{
                        font-size: 16px;   
                        display: block;
                        @include multi-line-ellipsis(2,28px);
                        height: 56px;
                    }
                    p{
                        height: 17px;
                        line-height: 17px;
                        font-size: 13px;
                        padding-top: 17px;
                        overflow: hidden;
                        color: #999;
                        span{
                            padding-right: 20px;
                        }
                    }
                }

              }
           }
        }
       
    }
    .Iindex3-2{
        width: 392px;
        margin-top: -15px;
        .list{
            .lis{
                display: flex;
                overflow: hidden;
                height: 46px;
                line-height: 46px;
                font-size: 16px;
                &:nth-of-type(-n+3){
                  span{
                    color: #F83030;
                  }
                }
                span{
                    display: block;
                    width: 20px;
                    color: #FF803D;
                    padding-right: 13px;
                    text-align: center;
                    font-weight: bold;
                    font-style: italic;
                }
                p{
                    flex: 1;
                    overflow: hidden;
                    @include single-line-ellipsis;
                }
            }
        }
    }
    .Iindex3-3{
        width: 100%;
        padding-bottom: 40px;
        .item{
            float: left;
            width: 373px;
            &:nth-child(2){
                padding: 0 40px;
            }
            .list{
                padding-top: 16px;
                position: relative;
                &::before{
                    left: 3px;
                    top: 25px;
                    border: 1px dashed #ebe9e9;
                    height: calc(100% - 45px);
                    content: '';
                    position: absolute;
                    z-index: 1;
                }
                .lis{
                    height: 40px;
                    line-height: 40px;
                    position: relative;
                    z-index: 1;
                    padding-left: 20px;
                    display: block;
                    @include single-line-ellipsis;
                    &:hover{
                        &::before{
                            background: var(--color);
                        }
                    }
                    &::before{
                        content: '';
                        width: 4px;
                        height: 4px;
                        background: #CFCFCF;
                        border-radius: 50%;
                        opacity: 1;
                        display: block;
                        left: 2px;
                        top: 50%;
                        margin-top: -2px;
                        position: absolute;
                    }
                }
            }
            .ul1{
                padding-top: 8px;
                width: calc(100% + 16px);
                li{
                    float: left;
                    width: 166px;
                    padding: 16px 40px 0 0;
                    &:nth-child(2n){
                        padding-right: 0px;
                    }
                    .box{
                        display: block;
                        width: 100%;
                        &:hover{
                            img{
                                transform: scale(1.1);                            }
                        }
                    }
                    .img{
                        width: 100%;
                        height: 98px;
                        border-radius: 10px;
                      
                    }
                    p{
                        height: 44px;
                        @include multi-line-ellipsis(2,22px);
                        padding-top: 8px;

                    }

                }
            }
            .ul2{
                padding-top: 8px;
                width: calc(100% + 16px);
                li{
                    float: left;
                    width: 114px;
                    height: 114px;
                    padding: 24px 16px 16px 0;
                    &:nth-child(3n){
                        padding-right: 0px;
                    }
                    .img{
                        width: 100%;
                        height: 100%;
                        border-radius: 10px;
                        &:hover{
                            img{
                                transform: scale(1.1);                            }
                        }
                    }
                }
            }
        }
    }
    .list_but{
        width: calc(100% + 22px);
        padding-bottom: 40px;
        .btn_{
            float: left;
            height: 45px;
            line-height: 45px;
            border: 1px solid #EFEFEF;
            background: #F9F9F9;
            padding: 0 20px;
            font-size: 16px;
            margin: 24px 20px 0 0;
            border-radius: 6px;
            &:hover{
                background: var(--hoverbgopacity);
                color: var(--color);
                border-color: var(--hoverbgopacity);
            }


        }
    }
    .Iindex3-4{
        .list_but{
            padding-bottom: 0px;
            width: calc(100% + 30px);
            .btn_{
                width: 174px;
                height: 50px;
                text-align: center;
                overflow: hidden;
                line-height: 50px;
                margin-right: 30px;
            }
        }
    }
}
.Iindex_youqing{
    overflow: hidden;
    .list{
        line-height: 30px;
        width: calc(100% + 30px);
        a{
            display: inline-block;
            vertical-align: middle;
            margin-right: 30px;
        }
    }
}
.QZ-up{
    background: url("../images/TOP.png") no-repeat center;
    width: 80px;
    height: 80px;
    position: fixed;
    bottom: 5vh;
    left: 50%;
    margin-left:700px;
    cursor: pointer;
    display: none;
}
.Min1{
    .list{
        overflow: hidden;
        padding-bottom: 10px;
        li{
            float: left;
            width: 250px;
            height: 142px;  
            display: block;
            .img{
                width: 100%;
                height: 100%;
                display: block;
                border-radius: 16px;
                &:hover{
                   img{
                    transform: scale(1.1);
                   }
                }
            }
            &:first-of-type{
                width: 498px;
                height: 300px;
                margin-right: 20px;
            }
            &:last-child{
                margin-top: 16px;
            }
        }
        .swiper{
            height: 100%;
            border-radius: 16px;
            overflow: hidden;
            width: 100%;
            margin-bottom: 8px;
            .img{
                width: 100%;
                height: 100%;
                display: block;
                color: #fff;
                overflow: hidden;
                position: relative;
                border-radius: 16px;
                p{
                    height: 144px;
                    background: linear-gradient(180deg, rgba(0,0,0,0) 0%, #000000 100%);
                    opacity: 1; 
                    position: absolute;
                    left: 0;
                    bottom: 0;
                    width: 100%;
                    padding: 0 20px;
                    padding-top: 94px;
                    text-align: center;
                    box-sizing: border-box;
                    line-height: 40px;
                    @include single-line-ellipsis;
                    font-size: 18px;
                }
            }
            .swiper-button-prev,.swiper-button-next{
                background: none;
                background: url("../images/prev.png") no-repeat center;
                width: 32px;
                height: 32px;
                cursor: pointer;
                margin-top: -16px;
                &:hover{
                    opacity: 0.9;
                }
                &::after{
                    display: none;
                }
              
            }
            .swiper-button-next{
                transform: rotate(180deg);
            }
        }
    }
}
.Min2{
    .title + .list li:first-child{
        padding-top: 0px;
    }
    .list{
     
       li{
        padding: 16px 0;
          .box{
            display: flex;
            overflow: hidden;
            &:hover{
                img{
                    transform: scale(1.1);       
                }
            }
            .img{
                width: 172px;
                height: 96px;
                border-radius: 12px;
                overflow: hidden;

            }
            .flex1{
                overflow: hidden;
                padding-left: 20px;
                .name{
                    font-size: 16px;   
                    display: block;
                    @include multi-line-ellipsis(2,28px);
                    height: 56px;
                }
                p{
                    height: 17px;
                    line-height: 17px;
                    font-size: 13px;
                    padding-top: 17px;
                    overflow: hidden;
                    color: #999;
                    span{
                        padding-right: 20px;
                    }
                }
            }

          }
       }
    }
}
.Min3{
    .list_but{
        width: calc(100% + 22px);
        padding-bottom: 20px;
        .btn_{
            float: left;
            height: 45px;
            line-height: 45px;
            border: 1px solid #EFEFEF;
            background: #F9F9F9;
            padding: 0 14px;
            font-size: 16px;
            margin: 24px 20px 0 0;
            border-radius: 6px;
            &:hover{
                background: var(--hoverbgopacity);
                color: var(--color);
                border-color: var(--hoverbgopacity);
            }


        }
    }
    .title + .list{
        padding-bottom: 0px;
        li{
            margin: 0 24px 24px 0; 
        }
    }
    .list{
        padding-bottom: 30px;
        width: calc(100% + 24px);
        li{
            float: left;
            width: 240px;
            height: 140px;
            overflow: hidden;
            margin: 24px 24px 0 0;
            border-radius: 12px;
            .img{
                width: 100%;
                height: 100%;
                display: block;
                overflow: hidden;
                position: relative;
                &:hover{
                    img{
                        transform: scale(1.1);
                    }
                }
                .motai{
                    position: absolute;
                    top: 0px;
                    left: 0px;
                    width: 100%;
                    height: 100%;
                    background: rgba(0, 0, 0, 0.5);
                    display: flex;
                    color: #fff;
                    align-items: center;
                    justify-content: center;
                    &.nobj{
                        background: none;
                    }
                    p{
                        span{
                            display: block;
                            text-align: center;
                            width: 100%;
                            overflow: hidden;
                            height: 32px;
                            line-height: 32px;
                            @include single-line-ellipsis;
                            font-size: 16px;
                        }
                    }
                }
            }
        }
        &.theme{
            li{
                height: auto;
                width: 208px;
                margin-right: 17px;
                .img{
                    height: 120px;
                }
                .name{
                    height: 48px;
                    padding-top: 10px;
                    display: block;
                    overflow: hidden;
                    font-size: 16px;
                    @include multi-line-ellipsis(2,24px)
                }
            }
        }
        
    }
    .list2{
        .box{
            float: left;
            width: 240px;
            height: 100px;
            display: block;
            margin: 0 24px 24px 0;
            overflow: hidden;
            position: relative;
            &:nth-child(3n){
                margin-right: 0px;
            }
            img{
                width: 100%;
                height: 100%;
                display: block;
            }
            .text{
                position: absolute;
                width: 100px;
                top: 25px;
                left: 120px;
                p{
                    height: 20px;
                    line-height: 20px;
                    width: 100%;
                    font-size: 16px;
                    @include single-line-ellipsis;
                    font-weight: bold;
                }
                span{
                    display: block;
                    height: 18px;
                    line-height: 18px;
                    color: #888;
                    padding-top: 10px;
                    overflow: hidden;
                    @include single-line-ellipsis;
                }
            }
        }
    }
    .list3{
        .box{
            float: left;
            width: 240px;
            height: 100px;
            display: block;
            margin: 0 24px 24px 0;
            overflow: hidden;
            position: relative;
            background: url("../images/tu_bj.png") no-repeat center;
            background-position: 0 0;
            background-size: 100% 100%;
            display: flex;
            align-items: center;
            justify-content: center;
            text-align: center;
            &:hover{
                background-image: url("../images/tu_bj_on.png");
            }
            &:nth-child(3n){
                margin-right: 0px;
            }
            .text{
                p{
                    height: 20px;
                    line-height: 20px;
                    width: 100%;
                    font-size: 16px;
                    @include single-line-ellipsis;
                    font-weight: bold;
                }
                span{
                    display: block;
                    height: 18px;
                    line-height: 18px;
                    color: #888;
                    padding-top: 10px;
                    overflow: hidden;
                    @include single-line-ellipsis;
                }
            }
        }
    }
}
.Min4{
    .list{
        overflow: hidden;
        ul{
            width: calc(100% + 24px);
        }
        li{
            float: left;
            width: 282px;
            height: 162px;
            margin: 0 24px 24px 0;
            overflow: hidden;
            border-radius: 12px;
            .img{
                width: 100%;
                height: 100%;
                display: block;
                position: relative;
                &:hover{
                    p{
                        top: 0px;
                    }
                }
            }
            p{
                position: absolute;
                top: 100%;
                left: 0px;
                width: 100%;
                height: 100%;
                background: rgba(0, 0, 0, 0.5);
                color: #fff;
                display: flex;
                align-items: center;
                justify-content: center;
                font-size: 20px;
                transition: all 0.2s linear;
                overflow: hidden;
            }
        }
    }
}
.Min5{
   .list{
    padding-bottom: 20px;
      li{
        overflow: hidden;
        .bt{
            display: block;
            height: 78px;
            line-height: 78px;
            overflow: hidden;
            font-size: 24px;
            font-weight: bold;
        }
        .text{
           line-height: 40px; 
           font-size: 18px;
           word-break: break-all;
        }
        .more{
            float: right;
            padding-top: 24px;
            color: var(--color);
            &:hover{
                text-decoration: underline;
            }
        }
      }
   }
   .list2{
    ul{
        position: relative;
        &::before{
            left: 3px;
            top: 25px;
            border-left: 1px dashed #ebe9e9;
            height: calc(100% - 45px);
            content: '';
            position: absolute;
            z-index: 1;
        }
    }
      li{
        display: flex;
        overflow: hidden;
        height: 56px;
        line-height: 56px;
        .a{
            font-size: 18px;
            overflow: hidden;
            padding-left: 18px;
            display: block;
            @include single-line-ellipsis;
            position: relative;
            &::before{
                content: '';
                width: 4px;
                height: 4px;
                background: #CFCFCF;
                border-radius: 50%;
                opacity: 1;
                display: block;
                left: 2px;
                top: 50%;
                margin-top: -2px;
                position: absolute;
            }
        }
        .stup{
            flex: 1;
            overflow: hidden;
            display: flex;
            justify-content: flex-end;
            align-items: center;
            .btn{
                padding-left: 24px;
                color: #777;
                cursor: pointer;
                &.on{
                    color: #F83030;
                   .fonticon{
                    fill: #F83030;
                   } 
                }
            }
            .fonticon{
                width: 18px;
                height: 18px;

            }
        }
      }
   }
}
.Min6{
    .list{
        padding-bottom: 16px;
        .box{
            float: left;
            margin: 16px 24px 0 0;
            display: block;
            overflow: hidden;
            width: 174px;
            height: 62px;
            border-radius:10px ;
            position: relative;
            img{
                width: 100%;
                height: 100%;
                display: block;
                object-fit: cover;
            }
            .motai{
                position: absolute;
                top: 100%;
                left: 0px;
                background: rgba(0, 0, 0, 0.5);
                width: 100%;
                height: 100%;
                display: flex;
                align-items: center;
                justify-content: center;
                transition: all 0.2s linear;
                .btn{
                    width: 62px;
                    height: 30px;
                    background: var(--color);
                    border-radius: 30px;
                    opacity: 1;
                    color: #fff;
                    text-align: center;
                    line-height: 30px;
                    font-size: 14px;
                    overflow: hidden;
                }
            }
            &:hover{
                .motai{
                    top: 0px;
                }
            }
            &:nth-child(4n){
                margin-right: 0px;
            }
            &.box2{
                display: flex;
                overflow: hidden;
                border: 1px solid #EFEFEF;
                box-sizing: border-box;
                align-items: center;
                img{
                    width: 46px;
                    height: 46px;
                    border-radius: 10px;
                    overflow: hidden;
                    margin: 0 16px 0 24px;

                }
                p{
                    flex: 1;
                    overflow: hidden;
                    @include single-line-ellipsis;
                    font-size: 16px;
                }
            }
        }
        ul{
            width: calc(100% + 60px);
            li{
                float: left;
                width: 78px;
                margin-right: 60px;
                margin-top: 24px;
                &:nth-of-type(6n){
                    margin-right: 0px;
                }
                .img{
                    width: 78px;
                    height: 78px;
                    border-radius: 10px;
                    display: block;
                }
                .name{
                    height: 43px;
                    width: 100%;
                    text-align: center;
                    line-height: 43px;
                    overflow: hidden;
                    display: block;
                    font-size: 16px;
                }
                .btn{
                    display: block;
                    height: 32px;
                    background: #F6F6F6;
                    border-radius: 6px; 
                    display: block;
                    overflow: hidden;
                    text-align: center;
                    line-height: 32px;
                    color: #999;
                    &:hover{
                        background: var(--color);
                        color: #fff;
                    }
                }


            }
        }
    } 
    .title + .list{
        margin-top: -16px;
    }
}
.Min7{
    .title + .list{
        margin-top: -10px;
    }
    .pagelink{
        margin-bottom: 16px;
    }
    .list{
        li{
            float: left;
            width: 46%;
            display: flex;
            overflow: hidden;
            align-items: center;
            margin: 16px 0;
            &:nth-of-type(2n){
                margin-left: 7.3%;
            }
            .img{
                width: 78px;
                height: 78px;  
                border-radius: 18px;
                overflow: hidden;
                display: block;
            }
            .flex1{
                flex: 1;
                overflow: hidden;
                padding: 0 12px;
                height: 78px;  
                .name{
                    display: block;
                    padding-top: 7px;
                    height: 24px;
                    line-height: 24px;
                    font-size: 18px;
                    @include single-line-ellipsis;
                }
                p{
                    padding-top: 17px;
                    height: 18px;
                    line-height: 18px;
                    color: #999;
                    @include single-line-ellipsis;
                }

            }
            .btn{
                width: 80px;
                height: 38px;
                background: var(--hoverbgopacity);
                color: var(--color);
                display: block;
                border-radius: 8px;
                overflow: hidden;
                text-align: center;
                line-height: 38px;
                &:hover{
                    background: var(--color);
                    color: #fff;
                }
            }

        }
    }
}
.Min8{
    .list{
        padding-bottom: 16px;
        li{
            float: left;
            width: 47%;
            height: 30px;
            line-height: 30px;
            padding: 10px 0;
            display: flex;
            overflow: hidden;
            font-size: 14px;
            border-bottom: 1px solid #F1F1F1;
            &:nth-child(2n){
                float: right;
            }
            span{
                flex: 1;
                overflow: hidden;
                padding-right: 10px;
                min-width: 50px;
            }
            a{
             @include single-line-ellipsis;
            }
        }
        &.theme{
            li{
                font-size: 16px;
    
            }
            span{
                color: #666;
            }
            .cor{
                cursor: pointer;
                color: var(--color);
            }
        }
      }
      .list2{
        width: calc(105%);
        padding-bottom: 16px;
         .btn{
            height: 40px;
            line-height: 40px;
            border-radius:20px;
            opacity: 1;
            border: 1px solid #E6E6E6;
            display: block;
            text-align: center;
            float: left;
            margin: 16px 24px 0 0;
            padding: 0 20px;
            overflow: hidden;
            &:hover{
                background: var(--color);
                color: #fff;
                border-color: var(--color);
            }
         }
      }
}
.Min9{
    background: #EFF6FE;
    margin-bottom: 20px;
    .center{
       padding: 42px 0;
       display: flex;
       overflow: hidden;
       .img_winking{
            background: url("../images/winking.png") no-repeat center;
            width: 300px;
            height: 252px;
            overflow: hidden;
            margin-top: 22px;
            background-size: 100% auto;
            position: relative;
            img{
                width: 278px;
                height: 158px;
                position: absolute; 
                top: 11px;  
                left: 11px;
            }
       }
       .flex1{
         padding: 0 33px;
         overflow: hidden;
         .name{
            height: 46px;
            line-height: 46px;
            overflow: hidden;
            display: flex;
            @include single-line-ellipsis;
            .h1{
                font-size: 36px;
                font-weight: bold;
                margin-right: 18px;
            }
            span{
                color: var(--color);
                font-size: 16px;
            }
         }
         .list_p{
            padding-top: 16px;
            p{
                height: 40px;
                line-height: 40px;
                font-size: 16px;
                overflow: hidden;
                @include single-line-ellipsis;
                &::before{
                    content: '';
                    display: inline-block;
                    vertical-align: middle;
                    width: 12px;
                    height: 12px;
                    background: url("../images/jt.png") no-repeat center;
                    margin-right: 10px;

                }
            }
         }

       }
       .btnwarp{
          width: 520px;
          .btn_big{
            height: 90px;
            width: 100%;
            background: var(--color);
            display: block;
            border-radius: 8px;
            display: flex;
            overflow: hidden;
            align-items: center;
            justify-content: center;
            color: #fff;
            text-align: center;
            span{
                display: block;
                width: 100%;
                overflow: hidden;
                @include single-line-ellipsis;
                &:nth-of-type(1){
                    font-size: 22px;
                    line-height: 28px;
                    font-weight: bold;
                }
                &:nth-of-type(2){
                    line-height: 18px;
                    padding-top: 7px;
                   
                }

            }
          }
          .tips{
             height: 18px;
             line-height: 18px;
             padding-top: 20px;
             color: #888;
             overflow: hidden;

          }
          .btnbox{
            padding-top: 8px;
            .btn{
                float: left;
                display: block;
                margin: 24px 20px 0 0;
                background: #FFFFFF;
                height: 56px;
                line-height: 56px;
                width: 250px;
                overflow: hidden;
                border-radius: 6px;
                display: flex;
                align-items: center;
                &:nth-child(2n){
                    margin-right: 0px;
                }
                &:hover{
                    background: var(--color);
                    .ico{
                        background-image: url("../images/win_on.png");
                    }
                   *{
                        color: #fff;
                    }
                }
                .ico{
                    margin: 0 15px 0 20px;
                    width: 28px;
                    height: 28px;
                    background: url("../images/win.png") no-repeat center;
                    display: block;
                    background-size: 100% auto;
                }
                span{
                    flex: 1;
                    overflow: hidden;
                    font-weight: bold;
                    font-size: 16px;
                    color: var(--color);
                    display: block;
                }
                p{
                    width: 110px;
                    text-align: center;
                    color: #666;
                    font-size: 12px;
                    position: relative;
                    &::before{
                        content: '';
                        width: 1px;
                        height: 26px;
                        position: absolute;
                        left: 0px;
                        background: #EAEAEA;
                        top: 50%;
                        margin-top: -13px;
                    }
                }

            }
          }

       }
    }
}
.Min10{
    .list{
        padding-bottom: 20px;
        li{
            display: flex;
            overflow: hidden;
            margin-top: 24px;
            .img{
                width: 208px;
                height: 124px;
                border-radius: 12px;
                overflow: hidden;
                &:hover{
                    img{
                        transform: scale(1.1);
                    }
                }
            }
            .infor{
                flex: 1;
                overflow: hidden;
                padding-left: 20px;
                .name{
                    display: block;
                    font-size: 18px;
                    padding-top: 6px;
                    @include single-line-ellipsis;
                    padding-bottom: 16px;
                    height: 30px;
                    line-height: 30px;
                }
                .bq{
                    height: 28px;
                    padding-top: 10px;
                    overflow: hidden;
                    .tab{
                        float: left;
                        height: 26px;
                        line-height: 26px;
                        font-size: 12px;
                        border:1px solid #f1f1f1;
                        padding: 0 15px;
                        border-radius: 20px;
                        margin-right: 12px;
                        &:last-child{
                            margin-right: 0px;
                        }
                        &[href]:hover{
                            background: var(--color);
                            color: #fff;
                            border-color: var(--color);
                        }
                    }
                }
                p{
                    flex: 1;
                    overflow: hidden;
                    font-size: 12px;
                    color: #888;
                    span{
                      padding-right: 20px;
                      &:last-child{
                          padding-right: 0px;
                      }
                    }
                 }
                .btn_{
                   padding-top: 8px;
                   height: 38px;
                   line-height: 38px;
                   overflow: hidden;
                   display: flex;
                   .bq{
                        flex: 1;
                        overflow: hidden;
                   }
                
                }
            }
            .btn{
                width: 96px;
                height: 38px;
                background: var(--hoverbgopacity);
                color: var(--color);
                text-align: center;
                display: block;
                border-radius: 6px;
                overflow: hidden;
                &:hover{
                    background: var(--color);
                    color: #fff;
                }
            }
        } 
        .float{
            li{
               float: left;
               width: 47.5%;
               &:nth-child(2n){
                margin-left: 5%;
               }
               .img{
                width: 216px;
                height: 154px;
               }
               .infor{
                    .name{
                        height: 60px;
                         white-space: initial;
                        padding-top: 0px;
                        @include  multi-line-ellipsis(2,30px);
                        padding-bottom: 0px; 
                    }
                    .btn_{
                        padding-top: 16px;
                    }
               }
            }
        }
    }
    .title + .list li:first-child{
        margin-top: 8px;
    }
    .title_switch.switchlabe{
        margin-bottom: 8px;
    }
}
.Ritem1{
    .list{
        .lis{
            display: flex;
            overflow: hidden;
            height: 46px;
            line-height: 46px;
            font-size: 16px;
            &:nth-of-type(-n+3){
              span{
                color: #F83030;
              }
            }
            span{
                display: block;
                width: 20px;
                color: #FF803D;
                padding-right: 13px;
                text-align: center;
                font-weight: bold;
                font-style: italic;
            }
            p{
                flex: 1;
                overflow: hidden;
                @include single-line-ellipsis;
            }
        }
    }
}
.Ritem2{
    .list{
        width: calc(100% + 16px);
        padding-bottom: 10px;
        li{
            float: left;
            width: 180px;
            padding: 24px 32px 0 0;
            &:nth-child(2n){
                padding-right: 0px;
            }
            .box{
                display: block;
                width: 100%;
                &:hover{
                    img{
                        transform: scale(1.1);                            }
                }
            }
            .img{
                width: 100%;
                height: 104px;
                border-radius: 12px;
              
            }
            p{
                height: 44px;
                @include multi-line-ellipsis(2,22px);
                padding-top: 8px;

            }

        }
    } 
}
.Ritem3{
   .list{
    width: 100%;
    overflow: hidden;
    padding-bottom: 10px;
    ul{
        width: calc(100% + 80px);
    }
    li{
        float: left;
         width: 78px; 
         margin: 24px 79px 0 0;
         &:nth-child(3n){
            margin-right: 0px;
         }
         .img{
            width: 78px;
            height: 78px;
            border-radius: 18px;
            display: block;
            overflow: hidden;
         }
         p{
            height: 20px;
            padding-top: 10px;
            text-align: center;
            overflow: hidden;

         }
    }
   } 
}
.Ritem4{
    .list{
        padding-bottom: 15px;
        width: calc(100% + 10px);
        .btn{
            float: left;
            height: 40px;
            background: #F9F9F9; 
            width: 100px;
            padding: 0 5px;
            line-height: 40px;
            display: block;
            overflow: hidden;
            text-align: center;
            margin: 24px 28px 0 0;
            border:1px solid #F9F9F9;
            border-radius: 6px;
            &:nth-of-type(3n){
                margin-right: 0px;
            }
            &.on,&:hover{
                background: var(--hoverbgopacity);
                border-color: var(--color);
                color: var(--color);
            }

        }
    }
}

.pagelink{
    padding: 20px 0;
    ul{
        display: flex;
        overflow: hidden;
        justify-content: center;
        li{
            flex: 1;
            text-align: center;
            background: #F6F6F6;
            height: 44px;
            line-height: 44px;
            border-radius: 6px;
            cursor: pointer;
            max-width: 364px;
            color: #666;
            a{
                display: block;
                width: 100%;
                height: 100%;
                color: #666;
            }
            &:nth-child(2n){
                margin-left: 40px;
            }
            &.on,&:hover{
                background: var(--color);
                color: #fff;
                a{
                    color: #fff;
                }
            }
        }
    }
}
.news_infor_h1{
    padding: 10px 0;
    border-bottom: 1px solid #EFEFEF;
    .h1{
        line-height: 45px;
        font-size: 36px;

    }
    p{
        line-height: 30px;
        padding-top: 10px;
    }
    .bq{
        height: 30px;
        line-height: 30px;
        color: #999;
        overflow: hidden;
        padding-top: 10px;
        span{
            padding-right: 40px;
            &:last-child{
                padding-right: 0px;
            }
        }
    }
    .text_{
        height: 30px;
        line-height: 30px;
        color: #999;
        overflow: hidden;
        padding-top: 15px;
        display: flex;
        .stup{
            display: flex;
            align-items: center;
            .btn{
                margin-right: 24px;
                cursor: pointer;
                cursor: pointer;
                color: #777;
                .fonticon{
                    width: 18px;
                    height: 18px;

                }
                &.on{
                    color: #F83030;
                   .fonticon{
                    fill: #F83030;
                   } 
                }
            }
        }
        .flex1{
            overflow: hidden;
            display: flex;
            justify-content: flex-end;
            a{
                color: var(--color);
                margin-left: 32px;
                &:hover{
                    text-decoration: underline;
                }

            }
            .disabled{
                color: #777;
                &:hover{
                    text-decoration: none;
                }
            }

        }

    }
}

.news_li{
    ul{
        padding: 15px 0;
        li{
            height: 38px;
            line-height: 38px;
            display: flex;
            position: relative;
            z-index: 1;
            float: left;
            width: 48%;
            &:nth-of-type(1), &:nth-of-type(2){
                &::before{
                    height: 50%;
                    top: 50%;
                }
            }
            &:nth-last-of-type(1),  &:nth-last-of-type(2){
                &::before{
                    height: 50%;
                    top: 0%;
                }
            }
            &:nth-child(2n){
                margin-left: 4%;
            }
            &::before{
                left: 2px;
                top: 0%;
                border-left: 1px dashed #CFCFCF;
                height: 100%;
                content: '';
                position: absolute;
                z-index: 1;
                height: 100%;
            }
            &:hover{
              p::before{
                    background: var(--color);
                }
            }
            p{
                flex: 1;
                overflow: hidden;
                padding-left: 20px;
                font-size: 14px;
                @include single-line-ellipsis;
                position: relative;
                margin-right: 20px;
                &::before{
                    content: '';
                    width: 4px;
                    height: 4px;
                    background: #CFCFCF;
                    border-radius: 50%;
                    opacity: 1;
                    display: block;
                    left: 0px;
                    top: 50%;
                    margin-top: -2px;
                    position: absolute;
                }
            }
            span{
                color: #999;
                font-size: 13px;
            }
        }
    }
}
.swiperslide{
    padding: 24px;
    display: block;
    position: relative;
    .swiper-prev ,.swiper-next{
        position: absolute;
        top: 50%;
        background: url("../images/prev2.png") no-repeat center;
        width: 10px;
        height: 34px;
        background-repeat:  0 0;
        margin-top: -17px;
        cursor: pointer;
        opacity: 0.8;
        &:hover{
            opacity: 1;
        }
    }
    .swiper-prev{
        left: 0px;
        transform: rotate(180deg);
    }
    .swiper-next{
        right: 0px;
    }
    .swiper-button-disabled{
        opacity: 0.2;
        &:hover{
            opacity: 0.2;
        }
    }
    .swiper-slide{
        .img{
            width: 168px;
            height: 104px;
            border-radius: 10px; 
            display: block;
            overflow: hidden;
            position: relative;
            &:hover{
                img{
                    transform: scale(1.1);
                }
                p{
                    background: rgba(0, 0, 0, 0.5);
                    text-decoration: underline;
                }
            }
            p{
                position: absolute;
                top: 0px;
                left: 0px;
                width: 100%;
                height: 100%;
                display: flex;
                align-items: center;
                justify-content: center;
                background: rgba(0, 0, 0, 0.1);
                text-align: center;
                line-height: 30px;
                color: #fff;
            }
        }
    }

}

/*内容详情*/
.details_html{
    line-height: 40px;
    padding: 12px 0;
    word-wrap: break-word;
    font-size: 18px;
    p{
        padding-bottom: 10px;
        &:first-child{
          & > img{
            margin-top: 0px;

            }
        }
    }
    img{
        max-width: 80%;
    }
    p >img{
        display: block;
        max-width: 80%;
        margin: 5px auto;
        cursor: pointer;
        border-radius: 10px;
    }
    ul{
        padding-bottom: 10px;
    }
    table,iframe,video{
        margin: 0 auto;
        max-width: 100%;
        margin-bottom: 10px;
    }
    h3{
        font-size: 20px;
        font-weight: bold;
        line-height: 40px;
        padding-bottom: 10px;
    }
}
.details_warp{
    .details_html{
        padding-top: 0px;
    }
    .title.bor + .details_html{
        padding-top: 10px;
    }
}
.details_ul{
    ul{
        li{
            display: flex;
            overflow: hidden;
            height: 52px;  
            line-height: 52px;
            overflow: hidden;
            font-size: 15px;
            padding: 0 16px;
            border-radius: 4px;
            &:nth-of-type(odd){
               background: #F9F9F9;
            }
            span{
                color: #666;
            }
            p{
                flex: 1;
                overflow: hidden;
                text-align: right;
                word-break: break-all;
                padding-left: 20px;
                @include single-line-ellipsis;
            }

        }
    }
}
.zt-banner{
    margin: 10px 0;
    height: 300px;
    overflow: hidden;
    .img{
        width: 100%;
        height: 100%;
        border-radius: 16px;
    }

}

.contL_Nav{
    width: 100%;
    .bt_h{
        height: 60px;
        line-height: 60px;
        font-size: 24px;
        overflow: hidden;
    }
    ul{
        li{
            .bt{
                height: 52px;
                display: flex;
                overflow: hidden;
                padding: 0 12px;
                line-height: 52px;
                align-items: center;
                cursor: pointer;
                user-select: none;
                border-radius: 6px;  
                .fonticon{
                    width: 24px;
                    height: 24px;
                    margin-right: 10px;
                }
                a{
                    flex: 1;
                    overflow: hidden;
                    font-size: 16px;
                    color: #333;
                    &[href]:hover{
                        color: var(--color);
                    }

                }
            }
            .lis{
               margin: 8px 0 8px 17px; 
               border-left: 1px solid #DDDDDD;
               display: none;
               p{
                  padding:4px 0 4px 14px;
                  height: 44px;
                  line-height: 44px;
                  position: relative;
                  &::before{
                    position: absolute;
                    left: 0px;
                    top: 50%;
                    width: 6px;
                    height: 1px;
                    background: #DDDDDD;
                    content: '';
                   }
                   a{
                    display: block;
                    height: 100%;
                    border-radius: 6px;
                    padding: 0 14px;
                    overflow: hidden;
                    font-size: 15px;
                    &:hover{
                        background: #E1EEFD;
                        color: var(--color);
                    }

                   }
                   &.on{
                    a{
                        background: #E1EEFD;
                        color: var(--color);
                    }
                   }
               }
            }

            &.on{
                .bt{
                    background: #EFEFEF;  
                    font-weight: bold;
                }
            }
            &.mor{
                .bt{
                    &::after{
                        width: 10px;
                        height: 6px;
                        content: '';
                        display: block;
                        transition: all 0.2s linear;
                        background: url("../images/more.png") no-repeat center;
                    }
                }
            }
        }
    }

}
.zanbox{
    padding: 20px 0;
    display: flex;
    align-items: center;
    justify-content: center;
    .icon{
        width: 58px;
        height: 58px;
        border-radius: 50%;
        border:1px solid var(--hoverbgopacity);
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        position: relative;
        &:hover{
            background: var(--color);
            color: #fff;
            .fonticon{
                fill: #fff;
            }
        }
        .fonticon{
            width: 28px;
            height: 28px;
            fill: var(--color);
        }
    }
}
.down_lis{
    display: flex;
    margin-bottom: 20px;
    .img{
        width: 90px;
        height: 90px;
        border-radius: 12px;
        overflow: hidden;
        display: block;
        margin-right: 20px;
    }
    .flex1{
        overflow: hidden;
        margin-right: 20px;
        .h1{
            height: 36px;
            line-height: 36px;
            font-size: 28px;
            font-weight: bold;
            @include single-line-ellipsis;
        }
        p{
            height: 18px;
            line-height: 18px;
            padding-top: 11px;
            overflow: hidden;
            color: #666;
            @include single-line-ellipsis;
        }
        .bq{
           overflow: hidden; 
           height: 24px;
           padding-top: 14px;
           a{
            display: block;
            float: left;
            height: 22px;
            line-height: 22px;
            border:1px solid var(--color);
            color: var(--color);
            border-radius: 4px;
            padding: 0 5px;
            margin-right: 12px;
            &[href]:hover{
                background:var(--color);
                color: #fff;
            }
            &:nth-child(3n-1){
                color: #FF803D;
                border-color: #FF803D;
                &[href]:hover{
                    background: #FF803D;
                }
            }
            &:nth-child(3n){
                color: #39B264;
                border-color: #39B264;
                &[href]:hover{
                    background: #39B264;
                }
            }
           }
        }
    }
    .btnbox{
        width: 120px;
        height: 42px;   
        position: relative;
        margin-top: 31px;
        cursor: pointer;
        .btn{
            text-align: center;
            display: block;
            width: 100%;
            height: 100%;
            color: #fff;
            font-size: 16px;
            background: var(--color);
            border-radius: 6px;
            line-height: 42px;
        }
        .box{
            position: absolute;
            width: 260px;
            padding: 0 24px;
            right: 0px;
            box-shadow: 0px 0px 16px rgba(0,0,0,0.1);
            background: linear-gradient(to bottom, #f1fbff 0%,#ffffff 50%);
            top: 50px;
            border-radius: 8px;
            display: none;
            z-index: 100;
            .bt{
                height: 60px;
                line-height: 60px;
                overflow: hidden;
                border-bottom: 1px solid #F1F1F1;
                font-size: 18px;
                font-weight: bold;
                color: var(--color);
            }
            .close{
                position: absolute;
                background: url("../images/close.png") no-repeat center;
                width: 12px;
                height: 12px;
                right: 24px;
                top: 26px;
                cursor: pointer;
                transition: all 0.2s linear;
                &:hover{
                    transform: rotate(180deg);
                }
            }
            .lis_box{
                padding: 4px 0;
                .lis{
                    padding: 12px 0;
                    display: flex;
                    overflow: hidden;
                    border-bottom: 1px dashed #F1F1F1;
                    height: 28px;
                    line-height: 28px;
                    font-size: 16px;
                    font-weight: 400;
                    &:last-child{
                        border:none;
                    }
                    img{
                        width: 28px;
                        height: 28px;
                        display: block;
                        margin-right: 10px;
                    }
                    span{
                        display: block;
                        @include single-line-ellipsis;
                        flex: 1;
                        overflow: hidden;
                    }
                }
            }

        }
    }
    .btntab{
        padding-bottom: 8px;
        display: flex;
        .btn{
            height: 90px;
            border-radius: 10px;
            overflow: hidden;
            display: flex;
            background: var(--color);
            color: #fff;
            align-items: center;
            justify-content: center;
            text-align: center;
            flex: 1;
            margin-top: 24px;
            .p{
                padding: 0 5px;
            }
            span{
                display: block;
                @include single-line-ellipsis;
                opacity: 0.9;
                &:first-child{
                    font-weight: bold;
                    font-size: 22px;
                    height: 28px;
                    line-height: 28px;
                    padding-bottom: 7px;
                    opacity: 1;
                }

            }
            &:nth-child(2){
               background: #39B264; 
               margin-left: 24px;
               flex: none;
               width: 275px;
            }
            
        }
    }
}
.ContL_box{
    position: relative;
    .ContL-mall{
        width: 110px;
        z-index: 100;
    }
    .ContR-mall{
        width: 658px;
    }
    .sharebox{
        position: relative;
        top: 200px;
        left: 0px;
        .btn{
            width: 90px;
            display: block;
            text-align: center;
            color: #666;
            margin-bottom: 20px;
            cursor: pointer;
            position: relative;
            &.on{
                color:  #F83030;
                .ico{
                    border-color: #F83030;
                    .fonticon{
                        fill: #F83030;
                    }
                }
            }
            .p{
                display: block;
                height: 30px;
                line-height: 30px;
                overflow: hidden;
                @include single-line-ellipsis;
            }
            .ico{
                width: 48px;
                height: 48px;
                border:1px solid #F1F1F1;
                border-radius: 50%;
                display: flex;
                align-items: center;
                justify-content: center;
                margin: 0 auto;
                .fonticon{
                    width: 22px;
                    height: 22px;
                    fill: #999;
                }
               

            }
        }
        .share { position: absolute; width: 147px; right: -130px; top: 45%; -webkit-transform: translate(0, -50%);
            -ms-transform: translate(0, -50%); transform: translate(0, -50%); display: none;
            z-index: 100;
            }
       .share::before { display: block; content: ''; border-right: 10px solid #fff; border-top: 10px solid transparent; border-bottom: 10px solid transparent; top: 50%; margin-top: -10px; position: absolute; }
       .share .social-share { width: 137px;  box-shadow: 0px 0px 10px rgba(0,0,0,0.1); background: #fff; border-radius: 5px; font-size: 14px; color: #222222; padding: 10px 0; margin-left: 10px; cursor: pointer; }
       .share .social-share a { display: block; margin: 0; margin-left: 20px; text-align: left; height: 30px; line-height: 30px; color: #222; width: auto; border: none; border-radius: none; font-size: 12px; }
       .share .social-share a::before { display: none; }
       .share .social-share a u { display: inline-block; vertical-align: middle; border-radius: 50%; height: 20px; width: 20px; position: relative; background-color: #676b8c; margin: -0px 7px 0 0; }
       .share .social-share a u::before { content: ''; display: block; position: absolute; top: 0; left: 0; bottom: 0; right: 0; margin: auto; background: url("../images/share.png") no-repeat center; width: 12px; height: 12px; background-position: -2px -1px; }
       .share .social-share a:hover { background: none; }
       .share .social-share .icon-weibo u { background-color: #f79401; }
       .share .social-share .icon-weibo u::before { background-position: -2px -32px; width: 15px; }
       .share .social-share .icon-wechat u { background-color: #3cbf7d; }
       .share .social-share .icon-wechat u::before { background-position: -1px -16px; width: 15px; }
       .share .social-share .icon-qzone u { background-color: #fec602; }
       .share .social-share .icon-qzone u::before { background-position: -2px -48px; width: 14px; height: 12px; }

    }
    .Min6 .list ul li{
        margin-right: 38px;
    }
}
.swiperjietu{
    .swiper{
        margin-bottom: 16px;
        .img{
            width: 100%;
            height: 178px;
            border-radius: 8px;
            img{
             width: 100%;
             height: 100%;
             display: block;
             object-fit: cover;
            }
          
        }
        &.swiper-h{
            .img{
                height:374px;
            }
        }
    } 
    .swiper-pagination-progressbar{
        position: relative;
        margin-top: 16px;
        height: 8px;
        background: #F9F9F9;
        border-radius: 8px;
        overflow: hidden;
    }
    .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{
        background: #EEEEEE;
        border-radius: 8px;
    }
    .tips{
        padding-top: 8px;
        line-height: 40px;
        text-align: center;
        color: #999;
        font-size: 18px;

    }
}

/*404*/
.warp404{
    padding: 6vh 0;
    width: 1200px;
    margin: 0 auto;
    text-align: center;
    img{
        display: block;
        margin: 0 auto;
    }
    p{
        color: #333333;
        line-height: 30px;
        padding-top: 90px;
        span{
            color:rgba(255, 80, 80, 1) ;
        }
    }
    .btn{
        width: 196px;
        height: 49px;
        background: var(--color);
        border-radius:50px;
        display: block;
        margin: 30px auto 0;
        text-align: center;
        display: block;
        line-height: 49px;
        font-size: 16px;
        color: #fff;
        &:hover{
            opacity: 0.9;
        }
    }

}
 
 /* 权限和隐私 */
 .layertanbox {
     position: fixed; top: 0; left: 0; right: 0; bottom: 0; margin: auto; z-index: 10; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.6);
     .textbox { position: absolute; z-index: 5; top: 50%; left: 50%; background: #fff; -webkit-box-shadow: 0px 12px 12px 0px rgba(0, 0, 0, 0.1), 0px -7px 7px 0px rgba(128, 103, 91, 0.2) inset; box-shadow: 0px 12px 12px 0px rgba(0, 0, 0, 0.1), 0px -7px 7px 0px rgba(128, 103, 91, 0.2) inset; border-radius: 20px; width: 400px; padding: 0 20px; text-align: center; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }
     .close { position: absolute; top: -0px; right: -40px; margin: auto; z-index: 10; cursor: pointer; background: url("../images/close2.png") no-repeat center;background-size: 100% 100%; width: 30px; height: 30px; }
     .oTitle { position: relative; display: block; text-align: left; padding-left: 15px; padding-top: 15px; height: 60px; }
     .oTitle p { display: block; font-size: 30px; color: #333333; font-weight: bold; line-height: 60px; white-space: nowrap; overflow: hidden; }
     .closebtn { display: block; cursor: pointer; border: 0; width: 340px; height: 48px; background: $theme;  border-radius: 10px; color: #fff; font-size: 18px; font-weight: bold; line-height: 48px; margin: 28px auto 34px; overflow: hidden; white-space: nowrap; }
     .text { display: block; height: 378px; border: none; padding: 0 30px; line-height: 28px; font-size: 16px; margin: 2px auto 30px; text-align: left; overflow: auto; }
     .text strong { display: block; font-size: 16px; color: #4D4D4D; line-height: 36px; }
    .text p:nth-of-type(1) { font-weight: bold; margin-bottom: 10px; }
    .text p:nth-last-of-type(1) { margin-bottom: 20px; }
     /* 反馈 */
    &.feedBack .feBack > span { font-size: 16px; color: #4C4C4C; line-height: 35px; margin-bottom: 4px; display: block; text-align: left; }
    &.feedBack .feBack .info { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: auto; background: #F9F9F9; -webkit-box-shadow: 0px -6px 6px 0px rgba(179, 179, 179, 0.2) inset; box-shadow: 0px -6px 6px 0px rgba(179, 179, 179, 0.2) inset; border-radius: 12px; padding: 10px; margin-bottom: 2px; }
    &.feedBack .feBack .info p { font-size: 14px; color: #333; line-height: 88px; }
    &.feedBack .feBack .otherRe { background: #F9F9F9; -webkit-box-shadow: 0px -6px 6px 0px rgba(179, 179, 179, 0.2) inset; box-shadow: 0px -6px 6px 0px rgba(179, 179, 179, 0.2) inset; border-radius: 12px; overflow: hidden; padding: 7px 0 13px; }
    &.feedBack .feBack textarea { width: 350px; height: 32px; line-height: 24px; border: none; resize: none; background: transparent; padding: 5px 20px; font-size: 16px; color: #666; }
    &.feedBack .feBack .photos { display: -webkit-box; display: -ms-flexbox; display: flex; overflow: hidden; }
    &.feedBack .feBack .photoInput { position: relative; width: 64px; height: 64px; border: 1px dashed #ccc; border-radius: 4px; text-align: center; margin-left: 20px; }
    &.feedBack .feBack .photoInput p { color: #666; font-size: 12px; }
    &.feedBack .feBack .photoInput p:nth-of-type(1) { font-size: 28px; color: #CDCDCD; margin-top: 6px; line-height: 30px; }
    &.feedBack .feBack .photoInput input { opacity: 0; position: absolute; top: 0; left: 0; width: 100%; height: 100%; cursor: pointer; }
    &.feedBack .feBack .photoList { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; width: 270px; overflow-x: auto; white-space: nowrap; font-size: 0; overflow-x: -moz-scrollbars-none; -ms-overflow-style: none; padding-bottom: 5px; padding-left: 10px; }
    &.feedBack .feBack .photoList p { width: 60px; height: 60px; padding: 3px; margin-right: 10px; border: 1px solid #eee; }
    &.feedBack .feBack .photoList::-webkit-scrollbar { height: 6px; }
    &.feedBack .feBack .photoList img { width: 60px; height: 60px; display: block; }
    &.feedBack .feBack .checkbox { position: relative; display: block; width: 50%; height: 25px; line-height: 25px; cursor: pointer; }
    &.feedBack .feBack .checkbox:nth-last-child(1) { border-bottom: none; }
    &.feedBack .feBack .checkbox input[type='checkbox'] { position: absolute; left: 0; top: 0; width: 20px; height: 20px; opacity: 0; }
    &.feedBack .feBack .checkbox label { position: absolute; left: 35px; top: 0; height: 28px; line-height: 28px; width: 124px; font-size: 14px; color: #666; text-align: left; }
    &.feedBack .feBack .checkbox label:after { content: ''; position: absolute; left: -25px; top: 7px; width: 16px; height: 16px; background: #E0E0E0; -webkit-box-shadow: 0px -2px 2px 0px rgba(0, 0, 0, 0.2) inset; box-shadow: 0px -2px 2px 0px rgba(0, 0, 0, 0.2) inset; border-radius: 50%; }
    &.feedBack .feBack .checkbox input[type='checkbox']:checked + label:after { background: #ff2741; -webkit-box-shadow: 0px -2px 2px 0px rgba(94, 30, 31, 0.2) inset; box-shadow: 0px -2px 2px 0px rgba(94, 30, 31, 0.2) inset; }
    &.feedBack .feBack .telBox { overflow: hidden; background-color: #f9f9f9; }
    &.feedBack .feBack .telBox input { display: block; border: none; padding: 0 20px; width: 360px; height: 40px; line-height: 40px; background: #F4F4F4;  border-radius: 10px; font-size: 16px; color: #999; }
    &.feedBack .feBack .telBox input::-webkit-input-placeholder { color: #999; }
    &.feedBack .feBack .telBox input:-moz-placeholder { color: #999; }
    &.feedBack .feBack .telBox input::-moz-placeholder { color: #999; }
    &.feedBack .feBack .telBox input:-ms-input-placeholder { color: #999; }
    &.feedBack .feSubmit input { display: block; border: 0; margin: 15px auto 20px; cursor: pointer; font-size: 18px; color: #FEFEFE; width: 100%; height: 48px; background: $theme;; -webkit-box-shadow: 0px 6px 6px 0px rgba(219, 219, 219, 0.1), 0px -6px 6px 0px rgba(0, 0, 0, 0.2) inset; box-shadow: 0px 6px 6px 0px rgba(219, 219, 219, 0.1), 0px -6px 6px 0px rgba(0, 0, 0, 0.2) inset; border-radius: 10px; }
    &.orderList .oWin:after, &.orderList .oAgin:after { content: ""; position: absolute; left: 30px; margin: auto; top: 13px; display: block; width: 88px; height: 76px;  }
    &.orderList .orderBox form .tel { display: block; border: none; width: 300px; height: 48px; background: #F4F4F4; -webkit-box-shadow: 0px -6px 6px 0px rgba(179, 179, 179, 0.2) inset; box-shadow: 0px -6px 6px 0px rgba(179, 179, 179, 0.2) inset; border-radius: 10px; line-height: 48px; color: #666; font-size: 18px; padding: 0 20px; margin: 0 auto; overflow: hidden; white-space: nowrap; }
    &.orderList .orderBox form .tel::-webkit-input-placeholder { color: #999; }
    &.orderList .orderBox form .tel:-moz-placeholder { color: #999; }
    &.orderList .orderBox form .tel::-moz-placeholder { color: #999; }
    &.orderList .orderBox form .tel:-ms-input-placeholder { color: #999; }
    &.orderList .orderBox form .tel:focus { color: #808080; }
    &.orderList .orderBox form p { color: #404040; font-size: 18px; line-height: 24px; margin-top: 16px; overflow: hidden; white-space: nowrap; }
    &.orderList .orderBox form p em { color: $theme; }
    &.orderList .orderBox form p:last-of-type { font-size: 16px; color: #ccc; margin-top: 4px; }
    &.orderList .orderBox form span { color:$theme; font-size: 14px; text-align: left; display: block; width: 306px; margin: 0 auto; overflow: hidden; white-space: nowrap; }
    &.orderList .orderBox form .oBtn, &.orderList .orderBox .oKnow { display: block; cursor: pointer; border: 0; width: 340px; height: 48px; line-height: 48px; background: $theme;; -webkit-box-shadow: 0px -6px 6px 0px rgba(179, 70, 62, 0.2) inset; box-shadow: 0px -6px 6px 0px rgba(179, 70, 62, 0.2) inset; border-radius: 10px; color: #fff; font-size: 18px; font-weight: bold; margin: 21px auto 43px; }
    &.orderList .orderBox .msg { display: block; color: $theme; font-size: 14px; text-align: left; width: 326px; margin: 0 auto; }
    &.orderList .orderBox .oWin { position: relative; width: 100%; font-size: 18px; border-radius: 3px; text-align: center; padding-top: 118px; }
    &.orderList .orderBox .oWin > strong { display: block; font-size: 20px; color: #4D4D4D; font-weight: bold; line-height: 28px; margin-bottom: 26px; margin-top: 16px; }
    &.orderList .orderBox .oWin > i { display: block; width: 64px; height: 64px ;background: url("../images/success.png") no-repeat center; margin: auto; position: relative; }
    &.orderList .orderBox .oAgin { position: relative; width: 100%; font-size: 18px; border-radius: 3px; text-align: center; padding-top: 118px; }
    &.orderList .orderBox .oAgin > strong { display: block; font-size: 20px; color: #4D4D4D; font-weight: bold; line-height: 28px; margin-bottom: 26px; margin-top: 16px; }
    &.orderList .orderBox .oAgin > i { display: block; width: 64px; height: 64px ;background: url("../images/success.png") no-repeat center; margin: auto; position: relative; }
}



@-webkit-keyframes fadIn { 0% { display: block;
    opacity: 0.8;
    -webkit-transform: translateY(-5px);
    transform: translateY(-5px); }
  100% { display: block;
    opacity: 1;
    -webkit-transform: translateY(5px);
    transform: translateY(5px); } }

@keyframes fadIn { 0% { display: block;
    opacity: 0.8;
    -webkit-transform: translateY(-5px);
    transform: translateY(-5px); }
  100% { display: block;
    opacity: 1;
    -webkit-transform: translateY(5px);
    transform: translateY(5px); } }
